kintone 플러그인 개발 메모 그 2(아무것도 하지 않는 설정 화면을 표시한다)

그 1 는 이쪽.

그 2에서는, 설정 화면을 작성해, 설정치를 보존·읽어 갑니다.

참고 : kintone 플러그인JavaScript API

설정값 저장/읽기



플러그인에는 설정치를 보존·읽어들이는 구조가 준비되어 있으므로, 그쪽을 사용해 보고 싶습니다.
  • 설정 화면 만들기
  • 설정값 저장
  • 설정값 로드

  • 위의 흐름으로 만들고 싶습니다.

    설정 화면 만들기



    kintone 플러그인 개발 절차 을 참고로 설정 화면을 작성합니다.
    처음에는 아무것도하지 않는 설정 화면을 만들고 싶습니다.

    설정 화면용 디렉토리와 파일 만들기


    cd src
    $ ls
    image       js      manifest.json
    $ mkdir html
    $ cd html
    $ touch config.html
    

    설정 화면용 파일 만들기



    config.html
    <html>
        <body>
            <h1>Hello,world設定画面</h1>
        </body>
    </html>
    

    매니페스트 파일 수정



    구성 화면용 파일을 패키징할 수 있도록 manifest.json에 추가합니다.

    manifest.json
    {
        "manifest_version": 1,
        "version": 1,
        "type": "APP",
        "name": { 
            "ja": "サンプルプラグイン",
            "en": "sample plugin"
        },
        "description": { 
            "ja": "これはサンプルプラグインです。",
            "en": "This is sample plugin."
        },
        "icon": "image/icon_helloworld.png",
        "homepage_url": { 
            "ja": "https://example.com/jp/",
            "en": "https://example.com/en-us/"
        },
        "desktop": {
            "js": [
                "js/customize.js"
            ]
        },
        "config": {
            "html": "html/config.html"
        }
    }
    

    재패키징



    다시 패키징할 때는, 최초로 패키징했을 때 동시에 작성되는 「비밀키 파일」도 지정합니다.
    $ ~/.npm-global/bin/kintone-plugin-packer --ppk 秘密鍵ファイル.ppk src
    Succeeded: /Users/kazoo/local/kintone/plugin/hello_world/plugin.zip
    

    배포



    kintone 시스템 관리에서 플러그인을 선택하여 플러그인 파일을 로드합니다.

    설정 화면 확인



    앱의 설정 화면에서 플러그인을 선택하면 플러그인에 기어 마크가 표시되는 것을 알 수 있습니다.


    기어 마크를 누르면 설정 화면이 표시됩니다.


    다음 번에는 설정 화면에 텍스트 상자를 추가해 보겠습니다.

    좋은 웹페이지 즐겨찾기