I am using this jquery code
$("#tasksViewType").selectBox().change(
function (){
var userId = $('#hiddenUserId').val();
var viewTypeId = $("#tasksViewType").val();
$.post('updateViewType',{viewType:viewTypeId,userId:userId});
location.reload(true);
});
so this update the view type in database and then refresh the page but in firefox this is not working I tested in chrome and opera this is working fine.
I even tried to put the timer between the 3rd and 4th line but then it update the view type in database but not refresh the page autometically.
Please let me know if you need more detail.
Reload the page in the callback function. Otherwise, the page will reload before the server script has updated the database.
$.post('updateViewType',{viewType:viewTypeId,userId:userId}, function() {
location.reload(true);
});
Set the extension of your page in the post.Like if your page is php type then give it like the following
$.post('updateViewType.php',{viewType:viewTypeId,userId:userId});
A possible reason could be the Cross-origin resource sharing restriction.
In firefox, by default, Cross-site HTTP requests are restricted.
You need to enable enable cross-origin resource sharing explicitly.
You may refer to the following links for more details.
how to get a cross origin resource sharing cors post request working
Enable CORS
Related
I have a web page with links towards other web pages. Once an user clicks in one of those links, a cookie is created, so in case he makes a purchase in the web page, the info related to this link is sent to us through an "API call".
So far, the code I have used in the following:
var storeCookie = getCookie("COOKIE_NAME"); //gets the cookie if it was previously created
if(tiendaCookie!=""){
var request = new XMLHttpRequest();
var url="URL TO A .PHP FILE IN MY SERVER";
peticion.open("POST",url,true);
peticion.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
peticion.send("PARAMETERS OF THE CALL")
The web pages with links on our web page added this code to their web page so the affiliation system can work but we found that when that code is called, the following is returned:
Cross-Origin Read Blocking (CORB) blocked cross-origin response "URL TO A .PHP FILE IN MY SERVER" with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.
I know this is not the right way to set up an API endpoint but I have no knowledge about how to proceed. I was going to try this plugin (https://wordpress.org/plugins/rest-api/) but it looks it is not supported in the latest versions of Wordpress.
What would be the right way to do what I am trying?
Thank you.
EDIT
I have done some more research and I have discovered that the problem might be in my .PHP file, because of:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
But I have this code on the .PHP file:
header("Access-Control-Allow-Origin: *");
What can I be missing?
I am currently in the process of creating a browser extension for a university project. However as I was writing down the extension I hit a really weird problem. To understand fully my situation I will need to describe it in debt from where my issue comes.
The extension that I am currently working on has to have a feature that checks if the browser can connect to the internet or not. That is why I decided to create a very simple AJAX request function and depending on the result returned by this function to determine if the user has internet connection or not.
That is why I created this very simple AJAX function that you can see bellow this line.
$.ajax({
url: "https://enable-cors.org/index.html",
crossDomain: true,
}).done(function() {
console.log("The link is active");
}).fail(function() {
console.log("Please try again later.");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
So far, as long as I understand what it is doing, it is working fine. For example, if you run the function as it is, it will succsesfully connect to the url and process with the ".done(function..." if you change the url to "index273.index" a file which does not exist it will process with the ".fail(function...". I was happy with the result until I decided to test it further more and unpluged my cable out of my computer. Then when I launched the extension it returned the last result from when the browser had connection with the internet. My explanation why the function is doing this is because it is caching the url result and if it cannot connect it gives the last cached value. My next step to try and solve this was to add "cache: false" after the "crossDomain: true" property but after that when I launch the extension it gives the following error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://enable-cors.org/index?_=1538599523573. (Reason: CORS header 'Access-Control-Allow-Origin' missing).
If someone can help me out sorting this problem I would be extremely grateful. I would want to apologise in advance for my English but this is not my native language.
PS: I am trying to implement this function in the popup menu, not into the "content_scripts" category. I am currently testing this under Firefox v62.0.3 (the latest available version when I write this post).
Best regards,
George
Maybe instead of calling the URL to check if the internet connection is available you could try using Navigator object: https://developer.mozilla.org/en-US/docs/Web/API/Navigator/connection
unless the remote server allowed origin (allowed cors) then you can't access it because it's a security issue.
But there are other things you can do:
You can load image and fire event when an image is loaded
You can access remote JSON via JSONP response
but you can't access other pages because (unless that server allows it) it's a security issue.
I want the user to be able to enter their website URL into an input box that is part of a Chrome Extension and the Chrome extension will use an AJAX request or something similar to detect and tell the user if the server behind the URL supports sending responses via HTTP2. Is this possible?
Maybe the WebRequest has a way of picking up this information? Or the new Fetch API? Could your request tell the server somehow that only HTTP2 replies are understood? I can't see an obvious way.
I know you can use window.chrome.loadTimes().connectionInfo to get the protocol of the current page but this requires loading the whole page which I don't want to do.
Example URLS:
Delivered over HTTP2: https://cdn.sstatic.net/
Delivered over HTTP 1.1: https://stackoverflow.com/
HTTP/2 responses require a "status" response header - https://http2.github.io/http2-spec/#HttpResponse, so to check whether the response is using HTTP/2, you can use the chrome.webRequest.onHeadersReceived event with "responseHeaders" in extraInfoSpec. For example, with your test cases:
chrome.webRequest.onHeadersReceived.addListener(function(details) {
var isHttp2 = details.responseHeaders.some(function(header) {
return header.name === 'status';
});
console.log('Request to ' + details.url + ', http2 = ' + isHttp2);
}, {
urls: ['https://cdn.sstatic.net/*', 'http://stackoverflow.com/*'],
types: ['xmlhttprequest']
}, ['responseHeaders']);
// Tests:
fetch('http://stackoverflow.com');
fetch('https://cdn.sstatic.net');
EDIT: Apparently you can do this with the iframe and webRequest trick! I found a reference gist (but I haven't tested it myself though):
https://gist.github.com/dergachev/e216b25d9a144914eae2
OLD ANSWER
You probably won't able able to do this without an external API. Here's why
1) Using ajax only requires that the server of the url to be tested sends CORS headers back to the user, otherwise the browser will not accept it.
2) You could create an iframe on the fly and use chrome.loadTimes().connectionInfo in the iframe contentWindow but if the server sends X-Frame-Options: Deny header the browser won't let you load the url in the iframe either.
3) Stripping the X-frame headers via webRequest API as mentioned here
Getting around X-Frame-Options DENY in a Chrome extension?
will likely not work, afaik Chrome extension are not allowed to modify the response body.
Possible solutions
1) The problems above could be solved using a simple proxy that adds the appropriate headers. Here's a reference on how to do it using Nginx
http://balaji-damodaran.com/programming/2015/07/30/nginx-headers.html
2) Just create a custom API that does the request for you server-side and parses the result to check for http2 support. If your extension gets popular it would still be fairly easy to scale it up e.g via caching and horizontal scaling.
Hope this helps!
There is a javascript line (you can try it in the browser console)
window.location.href='http://example.com'
that will push you to http://example.com
In the Browser(Google Chrome)-> Developer Tools-> Network section you may see the Status is 200 for it.
The question is:
how to get the status code 200/404/302 right BEFORE executing
window.location.href='http://example.com'
Thank you.
P.S. jQuery is OK for using.
The only way to get the status code would be to make the request before you navigate there. That means make an Ajax call to the resource and check the status. Only downside to this is the Same Origin Policy so the sites need to be in the same domain or they have to have CORS enabled for your resource.
The HTTP status code are generated by the server, so some HTTP request against the server needs to be executed BEFORE you can get a status code -- so you would need to do an Ajax call on the url -- adapting the simple example in JQuery.get you will have something like;
$.get( "http://example.com", function( data ) {
// Yeahh the URL works, we can do the page switch
window.location.href='http://example.com';
});
There are other examples in JQuery.get which deals with error handling etc, but you can read those for yourself.
Of cause, you don't need the entire page to get just the status, you can execute just a HTTP-HEAD which you can see discussed here
With all of this you may run into cross-site scripting restrictions which you can go an research separately -- there are lot of stack-overflow questions on that already.
I need to do a Cross-origin resource sharing (CORS) by ajax POST request to an action of a controller class (MVC) of another domain site, This is to keepalive the session. How do I achieve this? I am using jQuery ajax call for this by setting cross-domain property to true.
It's better if you can show me a code example.
Scenario
Domain A ----> Ajax Call--> Domain B to keepAlive session of domain B, until user logout from Domain A. For this Ajax call I'm planning to use JS file inside domain B
You have two possibilities. You can enable CORS on Domain B and use jQuery AJAX to access it. Note that CORS is supported only in modern browsers; especially only in IE 10+. IE8 and IE9 have XDomainRequest object, which you can use to do the same, but it has some limitations. See: http://caniuse.com/#search=cors.
Your second possibility is to use a dynamically created iframe and create a form inside there and post it to the domain B. The code would like something like this:
$("<iframe id='ifr' style='display:none;'></iframe>").appendTo("body");
var iframe = $("#ifr");
iframe.load(function () {
//Do something after iframe has been sent
//At least we need to remove the iframe
iframe.remove();
});
var iframeContents = iframe.contents();
var iframeBody = iframeContents.find("body");
iframeBody.append("<form id='myForm' action='yourURLComesHere' method='post'></form>");
var iframeForm = iframeBody.children("form");
//If you need form values, you can do it like this:
iframeForm.append("<input type='hidden' name='inputName' value='inputValue' />");
iframeForm.submit();
Domain A to Domain B (keepalive of Session): Too contradictory to share the sessions.
Should maintain Same Origin Policy for Security feature CSRF.
You cannot send an Ajax call from a site in "DomainA" to a URL in "DomainB" the browser won't let you, this is a security feature.
What you can do is send an Ajax request to "DomainA" and have the server side relay that message to "DomainB".