chrome 확장 'AJAX 요청' 을 함께 하 겠 습 니 다.
9866 단어 크롬 확장
content_script
이름 에서 부터 알 수 있 듯 이 contentscript 은 간접 광고 형 으로 일치 하 는 사이트 페이지 에 심 어 집 니 다.페이지 로 딩 완료 후 실행 합 니 다.content_script 의 가장 유용 한 점 은 사이트 페이지 의 DOM 을 조작 하 는 것 이다.평소에 전단 을 하 는 모든 작업 을 할 수 있 습 니 다. 예 를 들 어 DOM 을 추가, 수정, 삭제, DOM 값, 감청 사건 등 을 쉽게 할 수 있 습 니 다.그래서 남 의 로그 인 계좌 와 비밀 번 호 를 얻 으 려 면 아주 쉬 운 일 입 니 다. content 만 추가 하면 됩 니 다.script, 계 정과 비밀 번 호 를 감청 하 는 텍스트 상자 입 니 다. 값 을 받 은 후 자신의 서버 에 데 이 터 를 보 내 면 됩 니 다.따라서 확장 을 함부로 설치 하지 마라. 특히 공식 확장 라 이브 러 리 에서 다운로드 하지 않 는 확장 이다.
content 사용script
content 를 사용 해 야 합 니 다.script, manifest. json 에서 설정 해 야 합 니 다. 다음 과 같 습 니 다.
{
"manifest_version": 2,
"name": "My Extension",
"description": "Extension description",
"version": "1.0",
"content_scripts": {
"js": [
"content.js"
]
}
}
이렇게 하면 페이지 로 딩 이 완료 되면 content. js 를 불 러 오고 content. js 에서 페이지 요 소 를 제어 할 수 있 습 니 다.content. js 에서 jquery 를 사용 하려 면 jquery 파일 을 content. js 앞 에 추가 해 야 합 니 다. 예 를 들 어:
content_script jquery 사용
{
"content_scripts": {
"js": [
"jquery.js",
"content.js"
]
}
}
js 를 불 러 올 수 있 는 것 외 에 contentscripts 에 서 는 CSS 파일 도 불 러 올 수 있 습 니 다. 예 를 들 어:
content_script CSS 사용
{
"content_scripts": {
"js": [
"content.js"
],
"css": ["style.css"]
}
}
contentscripts 에서 중요 한 설정 은 matches 입 니 다. 확장 에 맞 는 웹 주 소 를 설정 하 는 데 사 용 됩 니 다. 예 를 들 어 이 확장 자 는 열 렸 을 때 만 사용 하고 싶 습 니 다. matches 는 이렇게 써 야 합 니 다.
일치 하 는 사이트 설정
{
"content_scripts": {
"js": [
"content.js"
],
"css": ["style.css"]
},
"matches": [
"http://*.jgb.cn/*"
]
}
www. amazon. com 과 일치 하려 면 다음 과 같이 추가 합 니 다.
{
"matches": [
"http://*.jgb.cn/*",
"http://*.amazon.com/*"
]
}
http 는 http 에 만 적 용 됩 니 다. amazon. com 과 같은 역 은 http 도 있 고 https 도 있 기 때문에 https 도 추가 해 야 합 니 다. 다음 과 같 습 니 다.
{
"matches": [
"http://*.jgb.cn/*",
"http://*.amazon.com/*",
"https://*.amazon.com/*"
]
}
background_script
chrome 확장 이 시 작 될 때 시 작 됩 니 다. 일 을 하고 명령 을 기다 리 고 있 습 니 다.페이지 요 소 를 제어 할 수 는 없 지만 contentscript 알려 주세요.ajax 와 마찬가지 로 페이지 가 열 릴 때 다른 서버 에 데 이 터 를 요청 하려 면 background 에 게 알려 줄 수 있 습 니 다.script, 요청 하 라 고 하고 돌아 온 데 이 터 를 contentscript。이렇게 하면 브 라 우 저의 안전 제한 에 영향 을 받 지 않 을 것 이다.
background 사용script
background 사용 하기script, manifest. json 에서 설정 해 야 합 니 다. 다음 과 같 습 니 다.
{
"manifest_version": 2,
"name": "My Extension",
"description": "Extension description",
"version": "1.0",
"background": {
"scripts": [
"background.js"
]
}
}
jquery 와 content 사용 하기scripts 와 마찬가지 로 jquery 파일 을 background. js 앞 에 추가 해 야 합 니 다. 예 를 들 어:
background 에서script 에서 jquery 사용
{
"background": {
"scripts": [
"jquery.js",
"background.js"
]
}
}
크로스 필드
기본 적 인 상황 에서 Ajax 는 도 메 인 을 뛰 어 넘 을 수 없 지만 확장 은 도 메 인 을 뛰 어 넘 는 설정 을 제공 합 니 다. 앞의 에서 언급 한 바 와 같이 permissions 입 니 다. chrome 의 일부 기능 을 확장 할 수 있 을 뿐만 아니 라 JS 가 디 렉 터 리 사이트 에 대한 크로스 도 메 인 방문 도 할 수 있 습 니 다. 예 를 들 어:
{
"permissions": [
"http://www.jgb.cn/" // www.jgb.cn
]
}
이상 의 설정 이 있 습 니 다. 이때 background 를 어떻게 통과 하 는 지 볼 수 있 습 니 다.scripts 가 Ajax 요청 을 실 현 했 습 니 다.
background 에 요청 보 내기
contentscript 에서 backgroundscript 발송 요청 은 여러 가지 방식 이 있 습 니 다. 여 기 는 제 가 자주 사용 하 는 것 만 보 여 줍 니 다. 대부분의 상황 을 만족 시 킬 수 있 습 니 다. 다른 방법 은 문 서 를 조회 하 십시오. 방법 은 다음 과 같 습 니 다.
chrome.extension.sendMessage({}, callBack);
sendmessage () 방법 은 두 개의 인자 가 있 습 니 다. 첫 번 째 로 보 낼 데 이 터 는 post 요청 처럼 두 번 째 는 리 셋 함수 입 니 다.여재 contentscript 에서 단 추 를 누 르 면 background 에 문자열 을 보 냅 니 다.script
$(function(){
$("#button").click(function(){
chrome.extension.sendMessage({'txt': ' '}, function(d){
console.log(d); //
});
});
})
background 에서 content 요청 을 감청 합 니 다.
background 에서 content 요청 을 감청 하려 면 chrome. extension. onMessage. addListener () 를 사용 하 십시오. 예 는 다음 과 같 습 니 다.
chrome.extension.onMessage.addListener(function(objRequest, _, sendResponse){});
object Request 는 요청 한 매개 변수 입 니 다. 이전 예 는 {'txt' 입 니 다. '여 기 는 보 낸 내용'} 입 니 다. object Request. txt 를 통 해 내용 을 얻 을 수 있 습 니 다.사실은 사전 이다.
sendResponse, 값 을 되 돌려 주 는 방법 으로 content 에 데 이 터 를 되 돌려 줄 수 있 습 니 다.script, 그러면 간단 한 예 는:
chrome.extension.onMessage.addListener(function(objRequest, _, sendResponse){
var strText = objRequest.txt;
// Ajax
$.ajax({
url: 'http://www.jgb.cn/',
type: 'POST',
data: {'txt': strText},
dataType: 'json',
}).then(function(){
// content_script
sendResponse({'status': 200});
}, function(){
// content_script
sendResponse({'status': 500});
});
});
이렇게 가면 contentscript to backgroundscript 요청 발송 및 background 사용script 에서 ajax 요청 을 수행 하 는 목적 은 매우 간단 하고 사용 하기 쉽 습 니 다.
이 를 바탕 으로 조건 과 데 이 터 를 추가 하면 수신 과 데 이 터 를 보 내 는 작업 을 잘 할 수 있다.예 를 들 어 자신의 서버 에 데 이 터 를 요청 하거나 보 내 는 것 이다.
chrome 시작 파 라 메 터 를 수정 하여 https 페이지 에서 http 페이지 에 ajax 요청 을 할 수 있 습 니 다.
background 사용 말고script 에서 Ajax 요청 을 시작 하 는 동시에 chrome 의 시작 매개 변 수 를 수정 하여 이 목적 을 달성 할 수 있 습 니 다.매개 변 수 는: -- allow - running - insecure - content, 조작 방법:
1, 오른쪽 클릭 chrome 단축 키, 속성 선택
2. 목표 의 마지막 에 -- allow - running - insecure - content 를 입력 하 십시오. 중간 에 빈 칸 이 있 습 니 다.
이렇게 하면 chrome 은 https 페이지 에서 http 에 ajax 요청 을 할 수 있 습 니 다.이 방법 은 목적 을 달성 할 수 있 지만 추천 하지 않 는 다. 왜냐하면 과학적 이지 않 기 때문이다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
인간한테 코드 검사가 너무 빨라~ 왕성인대 집합~4 14일째. 여러분 코드 리뷰 잘 하고 있어요? 인격 공격을 하지 않는다고 하는데 정말 괜찮겠어요? 진짜 네 댓글 때문에 슬픈 방송 없어? 방송에서 지적한 내용에 따라 변화가 없나요? 솔직하게 댓글 받아줄 수 있어...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.