Welcome to the Onshape forum! Ask questions and join in the discussions about everything Onshape.

First time visiting? Here are some places to start:
  1. Looking for a certain topic? Check out the categories filter or use Search (upper right).
  2. Need support? Ask a question to our Community Support category.
  3. Please submit support tickets for bugs but you can request improvements in the Product Feedback category.
  4. Be respectful, on topic and if you see a problem, Flag it.

If you would like to contact our Community Manager personally, feel free to send a private message or an email.

Options

Information on creating an onshape app

shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
I feel a little lost with regards to creating an app for onshape that allows some form of UI to be integrated into the onshape view.  Can anyone lead me to some resources that detail the main steps for this.  I am having trouble understanding where the coding side of the app is done.  Do I use a programming language and then upload some type of file into the onshape app in the developer portal?  I'm mainly confused about how to get what I've made into the onshape app.  What I am thinking of achieving is allowing users in our company to access a custom formatted BOM from an assembly in onshape without having to pull the assembly data into a standalone app.
Tagged:

Best Answer

  • Options
    caden_armstrongcaden_armstrong Member, User Group Leader Posts: 127 ✭✭✭
    Answer ✓
    What you are looking for are Extensions.
    For your usage, you are probably looking at an Element Right Panel context.

    The basics is that your app is a webpage, hosted where ever you want to host it (even localhost), and then the extension tells Onshape what to put into the Iframe, or what request to call in the case of a context menu.

Answers

  • Options
    caden_armstrongcaden_armstrong Member, User Group Leader Posts: 127 ✭✭✭
    Answer ✓
    What you are looking for are Extensions.
    For your usage, you are probably looking at an Element Right Panel context.

    The basics is that your app is a webpage, hosted where ever you want to host it (even localhost), and then the extension tells Onshape what to put into the Iframe, or what request to call in the case of a context menu.
  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @caden_armstrong
    Thanks a lot.   I will dig into that.  The content being in an iFrame makes tons of sense and hopefully means I can continue using what we are already using in a standalone format.
  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    edited March 2023
    @caden_armstrong thanks for the links to extensions, it looks like OS is updating the API with some new information and it's looking great.

    Hoping I'm not wrong about iframes, but they're used when you want your webpage to show inside an OS tab. Other than that, it'll show up on your webpage just fine and you can work all your magic without logging into OS. If you're creating an OS app and want to stick it into a tab, then use a iframe. 

    Beware that your internet provider could blacklist you when using an iframe url signature from OS. At least many moons ago that is. Godaddy blacklisted me and it took 2 months to get whitelisted. That's when I spun up my own VM and said go bye to Godaddy. If you're creating a website, I'd stay away from shared accounts and would favor your own VM.

    The simplest access to the API is glassworks and logging into OS.

    Not logged into OS (glassworks won't work):


    Logged into OS (glassworks does work):


    When logged into OS, you can use a browser url:

      
    You can get the mass properties using a browser:


    But you can't curl (the browser is authenticated, not the computer):


    The problems with the methods above is doing something with the response.

    You'll want to parse data and do something with it?

    let data = JSON.parse(data)
    data.items.foreach (blah, blah, blah)

    For the javascript users out there.


    This is es6 which is much cleaner than commonjs. I need to update rustyshed, I'd hate to share code used to authenticate.

    @shawn_crocker if you're going to load a program on everyone's computer then you can run localhost on all the computers. You can't run a iframe though. The url won't pierce the firewall and your local machine won't serve up the page. IT won't be happy if you open a port to your computer. I think localhost is out for you, talk to IT. It also means you can never turn your computer off. A cleaner approach is a server with a url,  you don't even need a name, just use the IP address. You'll need to authorize who can access the server. It's easy to set up a server to accept connections from only your company's address. Locking a server down is easy.

    You could setup oauth2 which handles the authentication for you. Oauth2 expands your capabilities to allow any OS user to use your app and keeps track of who's who. Of coarse, now you have to split the data into companies and not share data between companies. Company X won't like you sharing with company Y data. You don't have to share your program with anyone but people in your company. Releasing an app inside OS is easy, but they want to make sure it works. You don't have to release a program in the app store.

    I'd spin up a server and lock it down. I spend $6 bucks/monthly with $3 backup/monthly fee for a VM. The freak'n thing just runs and I don't service it often. I just run updates occasionally. My site is commonjs and I need to update to es6, this will take a weekend.

    mozilla

    my favorite how to right now

  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @billy2
    ATM, we all just run the web base retool.  We actually don't have much need for placing our app into the Onshape side panel but I am glad to see your info and that supplied by @caden_armstrong on the extensions.  I now confidently see the basic structure of implementing it if it ever comes up.
  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    I've been thinking how you can get stuff to/from retool. I'd automate it and have retool & OS talking together.

    Retool is a cloud app & so is OS. These 2 can communicate. Do it through a server and forget localhost. 

    Servers are cheap & easy to set up to perform a task.

    This is the cloud, it's difficult now, because no one is doing it. But it's going to get easier.




  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    edited March 2023
    Take a look at web hooks. They are OS events that'll call your server when something occurs. Then with one process you can keep things updated real time.

    I was looking through the app store and....

    It's probably still running. I took it down when godaddy blacklisted me, that's why it's private. When I spun up my new server, I ported it over but never took the private label off. It's a great way to track time. This ran in an iframe & in a tab.
  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @billy2
    Nice!  I will check that out.
  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    edited March 2023
    You can't get to it, don't try.

    But if you need help setting up a server let me know.

    You can do it in 2 easy steps:
    step 2: disable login
    step 1: setup RSA

    Your new server is now more secure than anything in your company.


  • Options
    Nath_McCNath_McC Member Posts: 114 PRO
    Im just commenting to follow the post. I am also interested in the integration between OnShape and Retool.
  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    edited March 2023
    So.... I'm now a developer for retool.



    This is the 4th system I've looked at with the subject of "share my data in the cloud", this one looks really good. I've been able to get pretty far in 30 minutes and watching a few videos. This is the future, is this the one? I don't know?

    So here are the steps if you're serious about retool:
    1. you don't need a server because retool is the server.
    2. forget about localhost, your computer sits behind a firewall, it's not in the cloud
    3. forget about oauth2, you won't need it, if you want to track who's doing what, you'll have to track it
    4. they use postgresql and OS is mongodb, who cares you'll map from one to the other
    5. when you're trying to create a table from OS, you'll have to work at it. OS won't have all the data in one api call
    6. it may require 4 or 5 calls to the OS api to build a collection that you'll import into retool
    7. there will be an admin who sets everything up
    8. it can update and stay current (push & pull), webhooks and event handlers in both systems
    9. most important, the viewer can have an edit mode, view only mode or a public mode (a public view requires a paid account)
    10. to access your OS data, use the API Key authorization method

    Let me know if I've missed anything.

  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @billy2
    Depending on what you are pulling, usually can get everything in one or two calls.  If I do a BOM call, I have a bom template setup with lots of extra columns just for pulling from the API.  You can specify your bom template when making a call.  This way BOM items all come in containing everything you need.  Even thumbnail urls.  It is strange too me how onshape has setup there bom JSON.  Headers all in an array and rows containing a header id.  Have to map and massage everything to get what would seem like a normal bom layout, an array of objects.
  • Options
    billy2billy2 Member, OS Professional, Mentor, Developers, User Group Leader Posts: 2,014 PRO
    Putting everything in a bom is an easy way to gather things for export. I don't know what you're trying to capture. Which variables do you setup inside onshape and what would you assign in retool?

    Something about images, each part and assy have thumbnails images captured, it's best to grab those because creating an image takes a long time, it's faster to just grab the thumbnails. I don't use the createimage API call it's too slow. I do dance around a lot in the OS api. I'll open an assy and create a list part images. It's fun to open the debug console and watch the flurry of async calls when downloading a page of images and it's fast. 

    I'm not sure how you track who did what? I'm thinking that might be easier in retool. I've never seen who did what in OS, but I haven't looked.

    Have you been able to generate a table inside retool with OS data yet?


  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @billy2
    ATM is just using keys, so no tracking.  We could go with oauth2 but no need right now.  We pretty much just pull data.  Only thing we create is possible a new document workspace or a new drawing through retool.  So for now, those two system changes just get registered as the admin having done them.


  • Options
    shawn_crockershawn_crocker Member, OS Professional Posts: 807 PRO
    @billy2
    When I pull anything from onshape, my goal is to have the items formatted the same as all other items in the system.  regardless of what method was used to bring the item into the system.  So basically I receive data from onshape and loop through everything applying a standard format to to each item and then every item gets added to a temporary state object.  Possibly additional calls are made to fill in any additional information that may not have been available through the endpoint that brought the item in.  like displaying the true thumbnail of a configured item rather then the default document image.  And the mass.  This data isn't available from the data you get from a search endpoint, so in this case, I loop through the search items and callout metadata for each one.  This way, any component in the system that displays information about an item or list of items, is being driven by a simple array of ids that are keying into the master temporary state.  So any change to the temporary state automatically updates everything in the system that is displaying information about the item that was changed.  Editing an items properties this way allows for the same edit modal to be used regardless of what view or table initiated the edit.  I have a database that catalogs things when needed.  It also is structured with the same item format so adding to or updating this database is also very straightforward.  The system allows the user to catalog anything they want but does so without the user knowing they are saving the item to database.  For instance we can attach a drawing to a bom item by clicking a table button that activates the drawing component of the item.  Then we can select a find button with opens up a modal and calls a search endpoint, displaying the available drawings.  The user can select which drawing they want to attach and then a series of events occur.  Calls go out to request a translation, then a loop polls to see if it is done.  When done, it downloads the pdf, sends it to another conversion api to get a .png of each sheet. Then it saves the images and the master pdf to a google drive, saves the parent item to database with ids linking to the google drive files.  Why this is great is because all the important MFG information is getting stored and synced to an onprem server.  So if the internet goes down, we can still dig out MFG data when needed.  Also, the drawings open up so fast when referencing a pdf rather then having onshape open and display the drawing which could mean the user has to wait sometimes 30 or more seconds to see what they need.  At some point, we may get computers on the shop floor so a system like this will be very useful allowing the formatting of required information for differing departments be very clear.  Assigning jobs to employees and having all the data they need to complete the work be visible in there own personal hub view is what I am imagining having setup someday.

    All in all, I find retool and onshape make extremely good companions.
Sign In or Register to comment.