Gmail 용 Chrome 확장 프로그램을 개발하는 방법은 무엇입니까?

Gmail 용 Chrome 확장 프로그램을 개발하는 방법은 무엇입니까?

---

Gmail 용 Chrome 확장 프로그램을 개발하는 중이며 현재 권장 사항이 무엇인지 알고 싶습니다.

예를 들면 :

• 기본적으로 모든 이메일에 GPG 서명 첨부
• 뭔가를하는 추가 버튼 추가 (이미 가지고 있습니다)
• 이메일을 보내는 행위를 탈취하고 무언가를 완료하도록 요청
• ...
• (가능한 것을 발견하는 데 도움이되는 예)

Gmail 기능을 크게 향상시키는 몇 가지 주목할만한 확장 프로그램이 있습니다.

• http://www.boomeranggmail.com/
• http://toolbox.mxhero.com/
• http://www.wisestamp.com/
• ...
• (저는 그들 중 어느 것과도 관련이 없습니다.

한 가지 옵션은 여기에있는 소스를 들여다 보는 것입니다. ~/Library/Application Support/Google/Chrome/Default

그러나 아마도 Gmail UI 및 기능을 조작하는 방법에 대한 좋은 자습서 / 일련의 사례가있을 수 있습니까?

Gmail 확장 / 가젯 API-작성 도구 모음에 버튼을 추가하는 방법은 무엇입니까?

프로그래밍 방식으로 버튼을 만들고 삽입해야합니다. 여기에는 Gmail 소스 코드 (스포일러 : 추악함)를 수색하는 데 상당한 시간이 필요합니다.

Gmail 창에 패널을 추가하기 위해 Chrome 확장을 빌드하는 방법은 무엇입니까?

장기적으로 직면하게 될 가장 큰 과제는 Gmail의 레이아웃이 예기치 않게 변경되어 이메일 검색 또는 수정 된 UI가 중단된다는 것입니다. 두 가지 문제를 모두 해결하려면 약간의 영리함이 필요하거나 Google이 갑자기 확장 프로그램을 중단할지 궁금해하는 밤에 잠을 자야합니다.

http://www.jamesyu.org/2011/02/05/introducing-gmailr-an-unofficial-javscript-api-for-gmail/

그들은 모두 유사한 기능을 가진 복잡한 API를 구축하고 있으며, Gmail이 앱 구조를 크게 변경하기로 결정하면 모두 독립적으로 중단 될 수 있습니다.

Gmail은 클로저 컴파일러를 통해 코드를 실행하여 모든 것을 난독 화합니다. 게다가 Gmail은 아마도 가장 정교한 자바 스크립트 앱 중 하나 일 것입니다.

Parse 창립자 ( https://github.com/jamesyu/gmailr) 의 라이브러리 이지만 1.5 년 동안 업데이트되지 않았습니다.

---

제가 지금까지 얻은 것을 보여 드릴 수 있습니다. 그래서 저는 특별히 선택자를 좋아하지 않습니다. .oh.J-Z-I.J-J5-Ji.T-I-ax7

참고 : http://anurag-maher.blogspot.co.uk/2012/12/developing-google-chrome-extension-for.html (그는 또한 그렇게하고 난독 화 된 선택기를 사용합니다)

manifest.json

"content_scripts": [
  {
    "matches": ["https://mail.google.com/*"],
    "css": ["mystyles.css"],
    "js": ["jquery-2.1.0.js", "myscript.js"]
  }
]

myscript.js

var icon = jQuery(".oh.J-Z-I.J-J5-Ji.T-I-ax7")
var clone = icon.clone();
clone.attr("data-tooltip", "my tooltip");
clone.on("click", function() {
    jQuery(".aDg").append("<p class='popup'>... sample content ...</p>");
});
icon.before(clone);

(reusing existing UI elements so my functionality looks natively)

---

https://developers.google.com/gmail/gadgets_overview

There are Sidebar Gadgets and Contextual Gadgets but they don not offer what I want to achieve.

Gmail Labs is a testing ground for experimental features that aren't quite ready for primetime. They may change, break or disappear at any time.

https://groups.google.com/forum/#!forum/gmail-labs-suggest-a-labs-feature It seems like the ability to develop Gmail Labs is locked to Google employees.

https://developers.google.com/gmail/

Need help? Find us on Stack Overflow under the gmail tag.

---

So yes, I would really like to know if there are any tutorials / reference materials out there?

(I reviewed many of the 'Similar Questions' and I'm afraid that my options here are limited, but I would be extremely happy if I shrine your enlightenment upon me)

---

It looks like you haven't stumbled upon the gmail.js project. It provides a rich API allowing to work with Gmail. However, please note that this project isn't maintained by Google. This means that any changes in the Gmail may break your extension and there is no guarantee that anyone will care to update gmail.js to address these changes.

---

There is a nice API for interacting with the Gmail DOM here:

https://www.inboxsdk.com/docs/

The getting started example helps you add a button to the compose toolbar.

// Compose Button
InboxSDK.load('1.0', 'Your App Id Here').then((sdk) => {
    sdk.Compose.registerComposeViewHandler((composeView) => {
        composeView.addButton({
            title: 'Your Title Here',
            iconUrl: 'Your Icon URL Here',
            onClick: (event) => {
                event.composeView.insertTextIntoBodyAtCursor('This was added to the message body!')
            }
        })
    })
})

---

Just ran into this blogpost from Square Engineering Team http://corner.squareup.com/2014/09/a-different-kind-of-scaling-problem.html

It is a chrome extension that displays contact information in the sidebar of Gmail when the user mouseover an email contact. (Just like Rapportive does)

The content script of the app is briefly described. It works as follow :

1. Check if the current page is an open email using document.location.href != currentUrl (you can also use gmail.js gmail.observe.on("open_email",function()) to achieve this).

2. Get the DOM element containing the email adress. I found out that this selector works for the sender : $(".acZ").find(".gD")

3. Insert the element in the sidebar with injectProfileWidget()

I am working on a similar extension that displays contact information pulled from Mixpanel here if you are interested.

ReferenceURL : https://stackoverflow.com/questions/23174710/how-to-develop-chrome-extension-for-gmail