jQuery AJAX 요청의 상대 URL 대 절대 URL

jQuery AJAX 요청의 상대 URL 대 절대 URL

스테이징 서버에서 AJAX 요청을 처리하는 데 어려움을 겪고 있습니다.내 개발 기계에서는 모두 잘 작동했지만, 업로드하자마자 모든 AJAX 요청이 작동하지 않았습니다.상대 URL을 변경하면(예:"index.dll")에서 절대 URL("http://example.com/index.php ")로 요청이 다시 작동하지만, 왜 그런지 이해할 수 없습니다.

요청 예제:

jQuery.post('index.php', {id: 1234, action: 1, step: 1}, function(data) { /* something */ });

이것은 작동하지 않습니다. 저는 심지어 방화벽 콘솔에도 나타나지 않습니다.하지만 성공 핸들러가 호출되는데, 이것은 매우 혼란스럽습니다.

이것은 잘 작동합니다.

jQuery.post('http://example.com/index.php', {id: 1234, action: 1, step: 1}, function(data) { /* something */ });

AJAX 요청이 왜 이런 식으로 작동하는지 설명할 수 있는 사람? x_X

추가해 보십시오./전에index.php첫 번째 예에서는 루트에서 보도록 강제합니다.디렉토리 구조가 위치와 정확히 동일한지 확인하기 위해 두 번 확인합니다.index.php사실은.

예를 들어 MVC 프레임워크에서 URL 라우팅을 사용하는 경우에는 실행이 실행되는 페이지와 항상 상대적이며, 주소 표시줄의 URL과 반드시 일치하지는 않습니다.

다음 파일 구조를 고려하십시오.

mysite/index.php
mysite/resources/javascript/my_javascript.js
mysite/resources/css/my_css.css

일반적으로 MVC 프레임워크는 모든 페이지 요청을 index.dll(http://www.mysite.com/index.php )과 같은 단일 파일을 통해 라우팅합니다.리소스와 스크립트는 항상 동일한 상대 경로에 있으므로 상대 URL을 쉽게 사용할 수 있습니다.Javascript는 항상 /resources/javascript/ CSS는 항상 /resources/css/에 있습니다.

브라우저 주소 표시줄에 있는 내용과 상관없이 사용할 수 있습니다.가능성:

http://www.mysite.com/index/
http://www.mysite.com/kittens/
http://www.mysite.com/kittens/cute/
http://www.mysite.com/kittens/fluffy/
etc..

오래된 게시물이라 오래 끌어서 죄송합니다.하지만 그것은 분명히 제 문제와 관련이 있었고 구글에서 최고의 결과였습니다.

정확히 같은 문제를 실험한 후에 저는 답을 결정했습니다.

스크립트를 실행하는 위치에 상관없이 요청된 파일은 /에 상대적입니다.

예를 들어, 내 파일 구조에는 js라는 이름의 폴더가 있습니다.그 아래에는 나의 agaxProcess.js 파일이 있습니다.내가 읽으려고 했던 xml 파일이 같은 디렉토리에 위치했기 때문에 표준 규칙에 따라 Ajax 호출의 URL이 단순히 url: 'myfile.xml'인 것이 타당했지만, 이것은 작동하지 않았습니다.

좀 놀다가 xml을 /에 넣고 다시 Ajax를 실행했습니다.Vuala!

좀 더 놀고, 어디서 js를 부르든 상관없지만, 여전히 /로 기본 설정됩니다.

나는 결국 내 xml을 'xml' 폴더에 넣었고 이제 다음 아약스가 어디서든 작동할 것입니다.

$.ajax({
        type:'get',
        dataType: 'xml',
        url: 'xml/class.xml',
        success: function(xml){
            $(xml).find('class').each(function(){
                //code here
            })
        }
    });

이런 문제를 피하는 가장 좋은 방법은 HTML 머리에 자바스크립트를 위한 구성 파일을 설정하는 것이라고 생각합니다. 페이지 머리에 다음과 같은 것을 포함할 수 있습니다.

<script>
        var url = "http:\/\/www.yourdomain.com\/application";
        var path = "\/path\/on\/server\/to root folder";
</script>

또 다른 접근 방식은 다음 변수를 창 개체에 연결하는 것입니다.

 <script>
window.myUrl = "http:\/\/www.yourdomain.com\/application";
...
    </script>

따라서 나중에 js 파일 내에서 다음 변수를 사용할 수 있습니다.

jQuery.post( url+'/index.php', {id: 1234, action: 1, step: 1}, function(data) { // something });

머리글의 스크립트는 앱 구성에 따라 자동 생성될 수 있으므로 앱이 배포될 때 url과 경로 변수가 그에 따라 변경됩니다.

두 개 이상의 도메인을 사용할 수 있는 사이트 또는 API 호출(예: TLD/ccTLD)과 같이 URL 기반이 변경될 수 있는 경우에는 특히 상대 경로를 사용해야 합니다.이 경우 이미 어딘가에서 언급했듯이 /로 상대 링크를 시작해야 합니다.이렇게 하면 현재 URL의 기본에 요청이 배치됩니다. 여기서 올바른 대상 파일을 찾기만 하면 모든 것이 정상입니다.

/folder-at-root(not-root)/inner-folder/target-file

PHP에서처럼 .../를 사용하여 디렉터리로 다시 들어가려고 하지 마십시오.Ajax가 운영하는 프런트 엔드는 이러한 사실을 알지 못합니다.

언급URL : https://stackoverflow.com/questions/2363511/relative-vs-absolute-urls-in-jquery-ajax-requests