error "Cannot return to provided redirect_uri" in chrome extension using stackapp auth 2.0 - google-chrome

I follow the tutorial here https://developer.chrome.com/apps/app_identity and use the api here https://developer.chrome.com/apps/identity but with no luck. Could anyone point out is anything wrong in this code?
function onGoogleLibraryLoaded() {
var redirect_uri = chrome.identity.getRedirectURL("http://qqibrow.github.io");
var full_url = "https://stackexchange.com/oauth/dialog?client_id=4716&redirect_uri=" + redirect_uri;
console.log(redirect_uri);
console.log(full_url);
chrome.identity.launchWebAuthFlow({
'url': full_url,
'interactive': true
}, authorizationCallback);
}
var authorizationCallback = function (data) {
// should print out redirect_uri with auth_token if succeed.
console.log(data);
};
// manifest.json
// ...
"permissions": [
"activeTab",
"identity",
"https://ajax.googleapis.com/",
"https://stackexchange.com/*",
"https://stackexchange.com/oauth/*",
"http://qqibrow.github.io/*"
],
"web_accessible_resources": [
"http://qqibrow.github.io/*",
"https://stackexchange.com/*",
],
// ...
If i try https://stackexchange.com/oauth/dialog?client_id=4716&redirect_uri=http://qqibrow.github.io it does work. But with above code, I always got a error page from stackexchange, saying that:
Application Login Failure error description: Cannot return to provided redirect_uri.

This is a creative usage of chrome.identity.getRedirectURL().
It does not allow you to redirect to an arbitrary domain; you can provide a path, but the domain for chrome.identity will be https://<app-id>.chromiumapp.org.
So, your call returns https://<app-id>.chromiumapp.org/http://qqibrow.github.io which is not a valid URL, and your auth fails.
I recommend re-reading the launchWebAuthFlow documentation.

Related

GoogleJsonResponseException: Field name is required

I'm working with the Google Analytics API for the first time and I'm trying to create a new property. I wrote a JS function in Google App Script:
function insertProperty() {
var resource =
{
// "accountId": "177832616",
"resource":{
"name": "Test Property 7",
// "dataRetentionResetOnNewActivity": false,
"websiteUrl": "https://www.test.com"
}
}
var accountID = '177832616';
var request = Analytics.Management.Webproperties.insert(resource, accountID);
// request.execute(function (response) { console.log(property.id) });
}
This is the error the API throws:
GoogleJsonResponseException: API call to analytics.management.webproperties.insert failed with error: Field name is required. (line 56, file "Code")
The insert() method seems to take two parameters: insert(Webproperty resource, string accountId);
Since it's not recognizing the name key/value I added to resource, my guess is I haven't declared the variable as a Webproperty type and I'm not sure how to do this. I assumed Webproperty was a { } variable type, but at this point I'm not sure what to try next. Doing research online, I'm not able to find anything regarding the API's Webproperty so any context/info is helpful.
From your question, I could understand that Google Analytics API is used with Advanced Google services of Google Apps Script. In this case, resource of Analytics.Management.Webproperties.insert(resource, accountId) can directly use the request body of the method of "Web Properties: insert". I think that the reason of your error is due to this. So please modify as follows and test it again.
From:
var resource =
{
// "accountId": "177832616",
"resource":{
"name": "Test Property 7",
// "dataRetentionResetOnNewActivity": false,
"websiteUrl": "https://www.test.com"
}
}
To:
var resource = {
"name": "Test Property 7",
"websiteUrl": "https://www.test.com"
}
Note:
When accountId is not correct, an error occurs. Please be careful this.
From iansedano's comment, in this case, request of var request = Analytics.Management.Webproperties.insert(resource, accountID); directly returns the values. So you can see the value like console.log(request) and console.log(request.toString()).
Reference:
Web Properties: insert

CORS in POST request chrome extension development [duplicate]

I can't see an answer to this in the Developer's Guide, though maybe I'm not looking in the right place.
I want to intercept HTTP requests with a Chrome Extension, and then forward it on, potentially with new/different HTTP headers - how can I do that?
PS: I am the author of Requestly - Chrome/Firefox extension to modify HTTP requests & responses.
It was certainly not possible when OP asked the question but now you can use WebRequest API with Manifest V2 and DeclarativeNetRequest API with Manifest V3 to write your own extension to modify Request & Response Headers.
Manifest V2 code
chrome.webRequest.onBeforeSendHeaders.addListener(
function(details) {
for (var i = 0; i < details.requestHeaders.length; ++i) {
if (details.requestHeaders[i].name === 'User-Agent') {
details.requestHeaders.splice(i, 1);
break;
}
}
return { requestHeaders: details.requestHeaders };
},
{urls: ['<all_urls>']},
['blocking', 'requestHeaders' /* , 'extraHeaders' */]
// uncomment 'extraHeaders' above in case of special headers since Chrome 72
// see https://developer.chrome.com/extensions/webRequest#life_cycle_footnote
);
Google Chrome is deprecating webRequest Blocking APIs in the Manifest V3. As per the official statement from Google on 28th Sep 2022, all extensions with Manifest v2 won't run on Chrome from June 2023 onwards. Here's an approach to Modify Request & Response headers with Manifest v3 - https://github.com/requestly/modify-headers-manifest-v3
Manifest V3 Code:
rules.ts
const allResourceTypes =
Object.values(chrome.declarativeNetRequest.ResourceType);
export default [
{
id: 1,
priority: 1,
action: {
type: chrome.declarativeNetRequest.RuleActionType.MODIFY_HEADERS,
requestHeaders: [
{
operation: chrome.declarativeNetRequest.HeaderOperation.SET,
header: 'x-test-request-header',
value: 'test-value',
},
]
},
condition: {
urlFilter: '/returnHeaders',
resourceTypes: allResourceTypes,
}
},
{
id: 2,
priority: 1,
action: {
type: chrome.declarativeNetRequest.RuleActionType.MODIFY_HEADERS,
responseHeaders: [
{
operation: chrome.declarativeNetRequest.HeaderOperation.SET,
header: 'x-test-response-header',
value: 'test-value',
},
]
},
condition: {
urlFilter: 'https://testheaders.com/exampleAPI',
resourceTypes: allResourceTypes,
}
},
];
background.ts
import rules from './rules';
chrome.declarativeNetRequest.updateDynamicRules({
removeRuleIds: rules.map((rule) => rule.id), // remove existing rules
addRules: rules
});
The complete source code is available in the GitHub repo - https://github.com/requestly/modify-headers-manifest-v3
If you want to use an existing Chrome/Firefox/Edge Extension, you can use Requestly which allows you to modify request and response headers. Have a look at this snapshot:
Modifying request headers ( https://developer.chrome.com/extensions/webRequest ) is supported in chrome 17.
You are looking at the right place, but intercepting HTTP requests does not exist yet, but the extension team is aware that it's a popular request and would like to get to it sometime in the near future.
Keep in mind that starting from chrome 72, some headers are not allowed unless you add extraHeaders in opt_extraInfoSpec
So the above example in #sachinjain024's answer will look something like this:
chrome.webRequest.onBeforeSendHeaders.addListener(
function(details) {
for (var i = 0; i < details.requestHeaders.length; ++i) {
if (details.requestHeaders[i].name === 'User-Agent') {
details.requestHeaders.splice(i, 1);
break;
}
}
return { requestHeaders: details.requestHeaders };
},
{urls: ['<all_urls>']},
[ 'blocking', 'requestHeaders', 'extraHeaders']
);
For more info, check the documentation Screenshot from the documentation https://developer.chrome.com/extensions/webRequest#life_cycle_footnote
For extensions using manifest version 3, you can no longer use chrome.webRequest.onBeforeSendHeaders.*. The alternative is chrome.declarativeNetRequest
Make the following changes in your manifest.json:
{
...
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"host_permissions": ["<all_urls>"],
"permissions": [
"declarativeNetRequest"
],
...
}
💡 "<all_urls>" is for modifying all outgoing urls's headers. Restrict this for your scope of your work
Make the following changes in your background.js:
// ...
const MY_CUSTOM_RULE_ID = 1
chrome.declarativeNetRequest.updateDynamicRules({
removeRuleIds: [MY_CUSTOM_RULE_ID],
addRules: [
{
id: MY_CUSTOM_RULE_ID,
priority: 1,
action: {
type: "modifyHeaders",
requestHeaders: [
{
operation: "set",
header: "my-custom-header",
value: "my custom header value"
}
]
},
condition: {
"resourceTypes": ["main_frame", "sub_frame"]
},
}
],
});
Result
Read the docs https://developer.chrome.com/docs/extensions/reference/declarativeNetRequest/
You could install ModHeader extension and add headers:
You can use WebRequest API which is now deprecated it allows you to modify request/response headers.
You can upgrade your extension to Manifest V3 to be able to use DeclativeNetRequest which also supports modifying request/response headers.
Or you can install Inssman chrome extension.
It allows you to modify HTTP(S) request/response headers, reqirect and block request, return custom data like HTML/CSS/JS/JSON and more.
And it is open source project

How to add response headers to data-urls by Chrome.webRequest

I according to the chrome.webRequest I want to change data-urls responseheaders.But I can't capture data request in chrome.webRequest.onHeadersReceived.
Am I wrong ?
chrome.webRequest.onBeforeRequest.addListener(
function (details) {
const url = details.url
if(url == 'http://www.example.com/api/getUsers') {
return {
redirectUrl: 'data:application/json; charset=utf-8,' +
JSON.stringify({"a":1, "b": 2})
}
}
return {cancel: false}
},
{urls: ["<all_urls>"]},
["blocking"]
)
chrome.webRequest.onHeadersReceived.addListener(
function (details) {
console.log(details) // can't capture data-urls
return {responseHeaders:details.responseHeaders};
},
{urls: ["<all_urls>"]},
["responseHeaders","blocking"]
)
You can't capture data: URLs with webRequest API, since data: is not a supported scheme for host permissions.
As such, even with <all_urls> permission/filter you won't get events for data:
Documentation quote:
The webRequest API only exposes requests that the extension has permission to see, given its host permissions. Moreover, only the following schemes are accessible: http://, https://, ftp://, file://, ws:// (since Chrome 58), wss:// (since Chrome 58), or chrome-extension://.
I'm pretty sure there's already a feature request for this, but I can't currently find it.

Skyscanner Flights API and Google script

I am trying to learn how to use the Skyscanner Flights API with Google Script. It seems that the information available online is not adapted to newbies like me.
From what I got, the procedure to gain access to the flights' prices is :
- to send a HTTP POST request with information about which flights we want information about
- then send a HTTP GET request which will give us the pricing information
I would like to do that with Google Script.
Here is my code so far :
function sky1() {
/*
Link to Skyscanner.com help : http://business.skyscanner.net/portal/en- GB/Documentation/FlightsLivePricingList
Link to Skyscanner api demo (api key given there): http://business.skyscanner.net/portal/en- GB/Documentation/FlightsLivePricingQuickStart
*/
var apikey = "prtl6749387986743898559646983194";// is given on skyscanner website for testing
var url = "http://partners.api.skyscanner.net/apiservices/pricing/v1.0/?apikey=" + apikey;
// Post http request to skyscanner
var post_resp=sendHttpPost(url,apikey);
}
function sendHttpPost(url) {
// post_params
var post_params = {
"Country": "CH",
"Currency": "CHF",
"Locale": "en-GB",
"Adults": 1,
"Children": 0,
"Infants": 0,
"OriginPlace": "12015",
"DestinationPlace": "5772",
"OutboundDate": "2015-08-09",
"InboundDate": "2015-08-23",
"LocationSchema": "Default",
"CabinClass": "Economy",
"GroupPricing": true
};
var options =
{
"method" : "POST",
"contentType" : "application/json", // didn't get what this means
"payload" : JSON.stringify(post_params), // didn't get what this means
"muteHttpExceptions" : true, // avoids error message
};
var post_resp=UrlFetchApp.fetch(url,options);
Logger.log(post_resp.getResponseCode());
return post_resp;
}
Any help would be very appreciated. This gives me a 415 response rode instead of a 201 indicating that a session has been created.
PS: I am not a programmer, I would be very grateful if we keep thing simple.
Skyscanner API team here. You may be interested to see a reference Javascript implementation at https://github.com/Skyscanner/skyscanner-api-js. I also recommend using Fiddler (a network tracing tool) to compare the request/response from the test harness at http://business.skyscanner.net/portal/en-GB/Documentation/FlightsLivePricingQuickStart with that of your code.

Im getting unexpectected token : for a valid JSON

I am working with ArcGIS, Esri request and I am trying to get a data from a webserver, but everytime I got the same "unexpected token : " error even when my response is correct.
Thanks in advance.
Here's my code:
require(["dojo/dom", "dojo/on", "dojo/dom-class", "dojo/_base/json", "esri/urlUtils", "esri/config", "esri/request", "dojo/domReady!"], function(dom, on, domClass, dojoJson, urlUtils, esriConfig, esriRequest) {
// fallback to proxy for non-CORS capable browsers
// esri.config.defaults.io.proxyUrl = "/arcgisserver/apis/javascript/proxy/proxy.ashx";
esriConfig.defaults.io.proxyUrl = "/proxy/proxy.ashx";
dom.byId("url").value = "http://api.citybik.es/v2/networks/dublinbikes";
dom.byId("content").value = "";
//handle the Go button's click event
on(dom.byId("submitRequest"), "click", getContent);
function getContent(){
var contentDiv = dom.byId("content");
contentDiv.value = "";
domClass.remove(contentDiv, "failure");
dom.byId("status").innerHTML = "Downloading...";
// //get the url
// var url = urlUtils.urlToObject(dom.byId("url").value);
// console.log("EL URL path",url.path)
// console.log("EL URL query",url.query)
// var requestHandle = esriRequest({
// "url": url.path,
// "content": url.query
// });
// requestHandle.then(requestSucceeded, requestFailed);
function requestSucceeded(data) {
console.log(data);
}
function requestFailed(error) {
console.log("Error: ", error.message);
}
var request = esriRequest({
url: "http://api.citybik.es/v2/networks/dublinbikes",
content: {
format: "json"
},
handleAs: "json",
callbackParamName: "retrive"
});
request.then(requestSucceeded, requestFailed);
}
}
);
Im getting:
Uncaught SyntaxError: Unexpected token : dublinbikes:2
The root problem is that you're getting esri.request a bit confused with what you're asking for, and what the server is giving back. Because you're making a request on a different domain (api.citybik.es) from where you're running the code (whatever your host is), you need to use either:
CORS
JSONP
a proxy
to get around the browser's security restrictions. There's plenty of detail on SO about these, I won't dribble on further.
Your code has two methods configured - the callbackParamName tells esri.request to use JSONP, and you've also got a proxy set just in case. The callbackParamName tells it to only use JSONP though, so the proxy is ignored.
Now the real problem, as I noted in a comment above, is that v2 of the CityBikes API doesn't actually seem to support JSONP, so your callback parameter is ignored and the server gives you back straight JSON. esri.request is expecting JSONP, and voila - unexpected token :. Requesting
http://api.citybik.es/v2/networks/dublinbikes?callback=stackoverflow
returns:
{
network: {
company: "JCDecaux",
href: "/v2/networks/dublinbikes",
....
See? No mention of our stackoverflow variable. If you look at v1 of the API instead, that DOES support JSONP. Requesting
http://api.citybik.es/dublinbikes.json?callback=stackoverflow
returns:
stackoverflow(
[
{
bikes: 1,
name: "Fenian Street",
idx: 0,
....
...and there is our stackoverflow variable. OR you can remove the callbackParamName from your esriRequest, and see if your proxy will process the JSON from the v2 address.